﻿<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="ToChucDeTail.aspx.cs" Inherits="ToChucDeTail" %>

<%@ Register Src="ucSlideShow.ascx" TagName="slideshow"
    TagPrefix="slideshow" %>
    <asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
<script src="js/jquery.bxSlider.min.js" type="text/javascript"></script>
<div class="tab">
				<div class="ac-tab"><span><%=pagename %></span></div>
			</div>
			<div class="details">
				<div class="left-detail">
					<div class="navi">
						<asp:Repeater runat="server" ID="repNavi">
                        <ItemTemplate>
                            <a href=""><%#Eval("Ten") %></a>
                        </ItemTemplate>
                        </asp:Repeater>
					</div>
				</div>
				<div class="right-detail">
					<div class="show-detail">
                    <asp:Repeater runat="server" ID="repSlider">
                    <ItemTemplate>
                        <div>
                        <a href="<%=GetLink() %>">
                        <img alt="Interdist" src="<%#LinkHelper.GetLinkHinhAnh(Eval("HinhAnh"))%>" width="750px" height="484px"/>
                        </a>
                        </div>
                    </ItemTemplate>
                    </asp:Repeater>
                    </div>
				</div>
			</div>
            <script type="text/javascript">
                $(function () {
                    // assign the slider to a variable
                    var slider = $('.show-detail').bxSlider({
                        mode: 'fade',
                        controls: false,
                        auto: true,
                        onBeforeSlide: function (currentSlide, totalSlides) {
                            $('.navi a').removeClass('pager-active');
                            $('.navi a').eq(currentSlide).addClass('pager-active');
                        }
                    });

                    // assign a click event to the external thumbnails
                    $('.navi a').click(function () {
                        var thumbIndex = $('.navi a').index(this);
                        // call the "goToSlide" public function
                        slider.goToSlide(thumbIndex);

                        // remove all active classes
                        $('.navi a').removeClass('pager-active');
                        // assisgn "pager-active" to clicked thumb
                        $(this).addClass('pager-active');
                        // very important! you must kill the links default behavior
                        return false;
                    });

                    // assign "pager-active" class to the first thumb
                    $('.navi a:first').addClass('pager-active');
                });
</script>
</asp:Content>

